<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    
  </style>
</head>
<body>
  <canvas class="cvs"></canvas>
</body>
<script>
  const cvs = document.querySelector(".cvs")
  cvs.width = 400;
  cvs.height = 400;

  const c2d = cvs.getContext("2d");

  // 圆弧
  // c2d.arc(200, 200, 100, 0, Math.PI, true);
  // 椭圆弧
  c2d.ellipse(200, 200, 50, 130, 0, 0, Math.PI);

  c2d.stroke();
  // c2d.fill();

  // 弧度的绘制都是路径，需要主动描边或填充


</script>
</html>